<template>
    <div class="employee-dep-management">
        <p class="title"> 招聘计划管理 </p>
        <div class="system-content">
            <div
                class="system-view-table flex-index"
                style="left:0;"
            >
                <div
                    class="table-top"
                    v-if="selectionList.length === 0"
                >
                    <div class="icon-search lt">
                        <el-input
                            placeholder="请输入岗位名称"
                            v-model="importInput"
                            @keyup.enter.native="searchClick"
                        >
                        </el-input>
                        <i
                            class="el-icon-search"
                            @click="searchClick"
                        ></i>
                    </div>
                    <div class="status">
                        <el-select
                            v-model="selectCateId"
                            @change="getPositionList"
                            :clearable="true"
                            placeholder="业务类型"
                        >
                            <el-option
                                v-for="item in selectCate"
                                :key="item.category_id"
                                :label="item.name"
                                :value="item.category_id"
                            >
                            </el-option>
                        </el-select>
                    </div>
                    <div class="status">
                        <el-select
                            v-model="selectStrucId"
                            @change="getPositionList"
                            :clearable="true"
                            placeholder="招聘部门"
                        >
                            <el-option
                                v-for="item in selectStruc"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </div>
                    <div class="status">
                        <el-button
                            type="primary"
                            @click="searchClick"
                        >筛选</el-button>
                    </div>
                    <el-button
                        v-if="userSaveAuth"
                        type="primary"
                        class="rt"
                        @click="newBtn"
                    >新建岗位</el-button>
                </div>
                <flexbox
                    v-if="selectionList.length > 0"
                    class="selection-bar"
                >
                    <div class="selected—title">已选中<span class="selected—count">{{selectionList.length}}</span>项</div>
                    <flexbox class="selection-items-box">
                        <flexbox
                            class="selection-item"
                            v-for="(item, index) in selectionInfo"
                            :key="index"
                            @click.native="selectionBarClick(item.type)"
                        >
                            <img
                                class="selection-item-icon"
                                :src="item.icon"
                            />
                            <div class="selection-item-name">{{item.name}}</div>
                        </flexbox>
                    </flexbox>
                </flexbox>
                <div class="flex-box">
                    <el-table
                        :data="tableData"
                        id="depTable"
                        :height="tableHeight"
                        v-loading="loading"
                        @selection-change="handleSelectionChange"
                        @row-click="rowClick"
                    >
                        <el-table-column
                            v-if="tableAssignAuth"
                            type="selection"
                            width="55"
                        ></el-table-column>
                        <el-table-column
                            v-for="(item, index) in fieldList"
                            :key="index"
                            :width="item.width"
                            show-overflow-tooltip
                            :prop="item.field"
                            :label="item.value"
                            :align="item.align"
                        >
                            <template
                                slot="header"
                                slot-scope="scope"
                            >
                                <div class="table-head-name">{{scope.column.label}}</div>
                            </template>
                        </el-table-column>
                        <el-table-column
                            fixed="right"
                            label="操作"
                            width="120"
                            align="center"
                        >
                            <template slot-scope="scope">
                                <el-button
                                    v-if="userUpdateAuth"
                                    @click="editBtn(scope)"
                                    type="text"
                                    size="small"
                                >编辑</el-button>
                                <el-button
                                    v-if="userDeleteAuth"
                                    @click="handleClick('delete', scope)"
                                    type="text"
                                    size="small"
                                >删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <div class="p-contianer">
                        <el-pagination
                            class="p-bar"
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="currentPage"
                            :page-sizes="pageSizes"
                            :page-size.sync="pageSize"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="total"
                        >
                        </el-pagination>
                    </div>
                </div>
            </div>
        </div>
        <!-- 岗位分配 -->
        <el-dialog
            title="分配岗位"
            :visible.sync="positionAssignVisible"
            width="50%"
            v-loading="loading"
            :close-on-click-modal="false"
            :modal-append-to-body="false"
            :before-close="positionAssignClose"
        >
            <div class="el-password">
                <el-form
                    ref="passForm"
                    :model="passForm"
                >
                    <el-form-item
                        label="岗位名称："
                    >
                        <div class="position-tag">
                            <el-tag type="info" v-for="(item, index) in selectionList" :key="index">{{item.name}}</el-tag>
                        </div>
                    </el-form-item>
                    <el-form-item
                        label="人事专员："
                    >
                        <el-select
                            v-model="selectHrId"
                            :clearable="true"
                            placeholder="人事专员"
                        >
                            <el-option
                                v-for="item in selectHrList"
                                :key="item.id"
                                :label="item.realname"
                                :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
            </div>
            <span
                slot="footer"
                class="dialog-footer"
            >
                <el-button @click="positionAssignClose">取 消</el-button>
                <el-button
                    type="primary"
                    @click="positionAssignSubmit(passForm)"
                >确 定</el-button>
            </span>
        </el-dialog>
        <!-- 岗位新建和编辑 -->
        <el-dialog
            :title="dialogTitle"
            :visible.sync="employeeCreateDialog"
            v-if="employeeCreateDialog"
            width="60%"
            :close-on-click-modal="false"
            :popper-append-to-body="false"
            v-loading="loading"
            :append-to-body="true"
            :before-close="newHandleClose"
        >
            <p class="new-dialog-title">基本信息</p>
            <el-form
                :inline="true"
                :model="formInline"
                ref="dialogRef"
                class="new-dialog-form"
                label-width="80px"
                :rules="dialogRules"
                label-position="top"
            >
                <el-form-item
                    :label="item.value"
                    :prop="item.field"
                    v-for="(item, index) in tableList"
                    :key="index"
                >
                    <span slot="label">{{item.value}}</span>
                    <el-tooltip
                        v-if="item.tips"
                        slot="label"
                        effect="dark"
                        :content="item.tips"
                        placement="top"
                    >
                        <i class="wukong wukong-help_tips"></i>
                    </el-tooltip>
                    <template v-if="item.type == 'select'">
                        <el-select
                            v-model="formInline[item.field]"
                            filterable
                            placeholder="请选择"
                        >
                            <el-option
                                v-for="optionItem in optionsList[item.field].list"
                                :key="optionItem.id"
                                :label="optionItem.name"
                                :value="optionItem.id"
                            >
                            </el-option>
                        </el-select>
                    </template>
                    <template v-else-if="item.type == 'selectCheckout'">
                        <el-select
                            v-model="formInline[item.field]"
                            popper-class="select-popper-class"
                            :popper-append-to-body="false"
                            filterable
                            multiple
                            placeholder="请选择"
                        >
                            <el-option-group
                                v-for="group in groupsList"
                                :key="group.pid"
                                :label="group.name"
                            >
                                <el-option
                                    v-for="item in group.list"
                                    :key="item.id"
                                    :label="item.title"
                                    :value="item.id"
                                >
                                </el-option>
                            </el-option-group>
                        </el-select>
                    </template>
                    <el-input
                        v-else
                        v-model="formInline[item.field]"
                        :disabled="dialogTitle == '编辑员工' && item.field == 'username'"
                    ></el-input>
                </el-form-item>
            </el-form>
            <span
                slot="footer"
                class="dialog-footer"
            >
                <el-button
                    type="primary"
                    @click="newDialogSubmit"
                >保 存</el-button>
                <el-button @click="employeeCreateDialog = false">取 消</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import {
    roleList,
} from "@/api/systemManagement/EmployeeDepManagement";
import { usersList as selectUsersList, depList } from "@/api/common"; // 直属上级接口
import {
    strucAndCateAPI,
    positionListAPI,
    positionAssignAPI,
    hrListAPI,
    addPositionAPI,
    editPositionAPI,
    delPositionAPI
} from "@/api/personnel/personnel";
import Edit from "./components/edit";
import { mapGetters } from "vuex";

export default {
    /** 系统管理 的 员工部门管理 */
    name: "employee-dep-management",
    components: {
        Edit
    },
    data() {
        return {
            // 列表
            loading: false, // 表的加载动画
            importInput: "", // 搜索

            /** 筛选 */
            selectCate: [], // 业务类型
            selectCateId: "",
            selectStruc: [], // 招聘部门
            selectStrucId: "",

            /** 人事专员 */
            selectHrList: [],
            selectHrId: "",

            /** 列表 */
            fieldList: [
                {
                    field: "name",
                    value: "招聘岗位",
                },
                {
                    field: "structure",
                    value: "招聘部门", 
                },
                {
                    field: "category",
                    value: "业务类型", 
                },
                {
                    field: "needs_num",
                    value: "招聘人数",
                    align: "center",
                    width: "150px"
                },
            ],
            selectionList: [], // 批量勾选数据
            tableData: [],
            tableHeight: document.documentElement.clientHeight - 300, // 表的高度

            /** 分页逻辑 */
            structureValue: "", // 左侧列表选中的值 用于筛选
            currentPage: 1,
            pageSize: 10,
            pageSizes: [10, 20, 30, 40],
            total: 0,

            // 新建和编辑
            employeeCreateDialog: false,
            dialogTitle: "新建岗位",
            formInline: {},
            positionId: "", // 编辑岗位id
            optionsList: {
                struc_id: {
                    field: "struc_id",
                    list: []
                },
                cate_id: {
                    field: "cate_id",
                    list: []
                },
            },
            groupsList: [],
            positionAssignVisible: false,
            passForm: {},
            dialogRules: {
                name: [
                    {
                        required: true,
                        message: "岗位名称不能为空",
                        trigger: "blur"
                    }
                ],
                struc_id: [
                    {
                        required: true,
                        message: "请选择招聘部门",
                        trigger: "change"
                    }
                ],
                cate_id: [
                    {
                        required: true,
                        message: "请选择招聘类型",
                        trigger: "change"
                    }
                ],
                needs_num: [
                    {
                        required: true,
                        message: "招聘数量不能为空",
                        trigger: "blur"
                    }
                ]
            },
        };
    },
    computed: {
        ...mapGetters(["hr"]),
        // 创建权限
        userSaveAuth(){
            return this.hr&&this.hr.position && this.hr.position.addposition
        },
        // 编辑权限
        userUpdateAuth() {
            return this.hr&&this.hr.position && this.hr.position.editposition
        },
        // 删除权限
        userDeleteAuth() {
            return this.hr&&this.hr.position && this.hr.position.delposition
        },
        // 分配人事专员权限
        tableAssignAuth() {
            return this.hr&&this.hr.position && this.hr.position.positionassign
        },
        selectionInfo: function() {
            let temps = [];
            if (this.tableAssignAuth) {
                temps.push({
                        name: "批量分配",
                        type: "assign",
                        icon: require("@/assets/img/selection_start.png")
                    })
            }
            return temps;
        },
        /** 添加列表 */
        tableList: function() {
            if (this.dialogTitle === "新建岗位") {
                return [
                    { field: "name", value: "岗位名称" },
                    { field: "struc_id", value: "招聘部门", type: "select" },
                    { field: "cate_id", value: "业务类型", type: "select" },
                    { field: "needs_num", value: "招聘数量" },
                ];
            } else {
                return [
                    { field: "name", value: "岗位名称" },
                    { field: "struc_id", value: "招聘部门", type: "select" },
                    { field: "cate_id", value: "业务类型", type: "select" },
                    { field: "needs_num", value: "招聘数量" },
                ];
            }
        }
    },
    methods: {
        // 获取部门和业务类型
        getStrucAndCate () {
            strucAndCateAPI().then(response => {
                this.selectCate = response.data.cate
                this.selectStruc = response.data.struc
                this.optionsList.cate_id.list = response.data.cate.map(function (item, index, array) {
                    item.id = item.category_id
                    return item
                })
                this.optionsList.struc_id.list = response.data.struc
                this.getPositionList();
            });
        },
        // 获取人事专员列表
        getHrList () {
            hrListAPI().then(response => {
                this.selectHrList = response.data
            });
        },
        // 操作
        handleClick(type, scope) {
            if (type === "edit") {
                this.createHandleInfo.action = "update";
                this.createHandleInfo.id = scope.row.id;
                this.createHandleInfo.data = scope.row;
                this.createHandleInfo.position = this.position;
                this.showHandleView = true;
            } else if (type === "delete") {
                // 删除
                this.$confirm("您确定要删除该岗位?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        delPositionAPI({
                            id: scope.row["id"]
                        })
                            .then(res => {
                                // this.tableData.splice(scope.$index, 1);
                                this.getPositionList();
                                this.$message({
                                    type: "success",
                                    message: res.data
                                });
                            })
                            .catch(() => {});
                    })
                    .catch(() => {
                        this.$message({
                            type: "info",
                            message: "已取消删除"
                        });
                    });
            } else if (type === "record") {
                this.detailData = scope.row;
                this.showDetail = true
            }
        },
        // 岗位分配
        positionAssignFun () {
            var ids = this.selectionList.map(function(item, index, array) {
                return item.id;
            });
            let params = {
                ids: ids,
                user_id: this.userId
            }
            positionAssignAPI(params).then(response => {
                this.$message({
                    type: "success",
                    message: res.data
                });
            }).catch(() => {
                this.$message({
                    type: "info",
                    message: "已取消删除"
                });
            });;
        },

        // 第一列点击事件
        rowClick(row, column, event) {
        },
        // 新建和编辑
        newHandleClose() {
            this.employeeCreateDialog = false;
        },
        // 新建岗位
        newBtn() {
            this.formInline = {
                name: "",
                struc_id: "",
                cate_id: "",
                needs_num: "",
            }
            this.employeeCreateDialog = true;
            this.dialogTitle = "新建岗位";
        },
        // 编辑岗位
        editBtn(item) {
            this.positionId = item.row.id
            var detail = {
                name: item.row.name,
                struc_id: item.row.struc_id,
                cate_id: item.row.cate_id,
                needs_num: item.row.needs_num
            }
            this.dialogTitle = "编辑岗位";
            this.formInline = detail;
            this.employeeCreateDialog = true;
        },
        
        // 搜索框
        searchClick() {
            this.currentPage = 1;
            this.getPositionList();
        },
        // 状态筛选
        statusChange() {
            this.currentPage = 1;
            this.getPositionList();
        },
        // 岗位新建/编辑
        newDialogSubmit() {
            this.$refs.dialogRef.validate(valid => {
                if (valid) {
                    if (this.dialogTitle == "新建岗位") {
                        this.loading = true;
                        addPositionAPI(this.formInline)
                            .then(res => {
                                this.$message.success("新建成功");
                                this.employeeCreateDialog = false;
                                this.getPositionList();
                                this.getSelectUserList();
                                this.loading = false;
                            })
                            .catch(() => {
                                this.loading = false;
                            });
                    } else {
                        this.loading = true;
                        var params = this.formInline
                        params.id = this.positionId
                        editPositionAPI(this.formInline)
                            .then(res => {
                                this.employeeCreateDialog = false;
                                this.$message.success("编辑成功");
                                this.getPositionList();
                                this.getSelectUserList();
                                this.loading = false;
                            })
                            .catch(() => {
                                this.loading = false;
                            });
                    }
                } else {
                    return false;
                }
            });
        },
        /** 分配岗位 */
        selectionBarClick(type) {
            var ids = this.selectionList.map(function(item, index, array) {
                return item.id;
            });
            if (type === "assign") {
                this.positionAssignVisible = true;
            }
        },
        // 分配岗位 -- 关闭按钮
        positionAssignClose() {
            this.selectHrId = "";
            this.positionAssignVisible = false;
        },
        // 分配岗位 -- 确定按钮
        positionAssignSubmit(val) {
            var ids = [];
            if (this.selectionList.length > 0) {
                ids = this.selectionList.map(function(item, index, array) {
                    return item.id;
                });
            } else {
                this.$message({
                    type: "info",
                    message: "请选择招聘岗位"
                });
                return null
            }
            if (!this.selectHrId) {
                this.$message({
                    type: "info",
                    message: "请选择人事专员"
                });
                return null
            }
            var params = {
                ids: ids.join(","),
                user_id: this.selectHrId
            }
            this.loading = true;
            positionAssignAPI(params)
                .then(res => {
                    if (res.code === 200) {
                        this.$message.success("分配成功");
                    } else {
                        this.$message({
                            type: "info",
                            message: res.msg
                        });
                    }
                    this.positionAssignClose();
                    this.loading = false;
                })
                .catch(() => {
                    this.loading = false;
                });
        },
        // 更改每页展示数量
        handleSizeChange(val) {
            this.pageSize = val;
            this.getPositionList();
        },
        // 更改当前页数
        handleCurrentChange(val) {
            this.currentPage = val;
            this.getPositionList();
        },
        // 勾选
        handleSelectionChange(val) {
            this.selectionList = val; // 勾选的行
        },
        // 岗位列表
        getPositionList() {
            this.loading = true;
            var params = {
                page: this.currentPage,
                limit: this.pageSize,
                name: this.importInput,
                cate_id: this.selectCateId,
                struc_id: this.selectStrucId
            };
            positionListAPI(params)
                .then(res => {
                    this.tableData = res.data.list;
                    this.total = res.data.dataCount;
                    this.loading = false;
                })
                .catch(() => {
                    this.loading = false;
                });
        },
        /** 获取选择直属上级列表 */
        getSelectUserList() {
            this.loading = true;
            selectUsersList({})
                .then(res => {
                    this.optionsList["parent_id"].list = [];
                    for (let i of res.data) {
                        this.optionsList["parent_id"].list.push({
                            id: i.id,
                            name: i.realname
                        });
                    }
                    this.loading = false;
                })
                .catch(() => {
                    this.loading = false;
                });
        },
    },
    mounted() {
        var self = this;
        /** 控制table的高度 */
        window.onresize = function() {
            self.tableHeight = document.documentElement.clientHeight - 260;
        };

        // 获取部门和业务类型
        this.getStrucAndCate()

        // 获取人事专员
        this.getHrList()

        // 部门树形列表
        this.getSelectUserList(); // 直属上级列表

        // 角色列表
        roleList({ tree: 1 }).then(res => {
            this.groupsList = res.data;
        });
    }
};
</script>

<style lang="scss" scoped>
.employee-dep-management {
    /* padding: 0 20px 20px; */
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}
.system-content {
    position: relative;
    height: 100%;
    flex: 1;
    display: flex;
    overflow: hidden;
}
.system-view-nav {
    width: 200px;
    height: 100%;
    overflow: auto;
    margin-right: 10px;
    background: #fff;
    padding-top: 20px;
    border: 1px solid #e6e6e6;
}
.title {
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    margin: 10px 0;
    color: #333;
    padding: 0 20px;
}
.system-view-table {
    background: #fff;
    border: 1px solid #e6e6e6;
    /* flex: 1; */
    position: absolute;
    top: 0;
    left: 210px;
    bottom: 0;
    right: 0;
}

.table-top {
    padding: 30px 0;
}

.status {
    display: inline-block;
    margin-left: 10px;
}
.status > span {
    margin-right: 10px;
}

.status-name {
    div {
        display: inline-block;
        width: 6px;
        height: 6px;
        border-radius: 3px;
    }
    color: $xr-color-primary;
    cursor: pointer;
}
/* 详情 */
.employee-dep-management /deep/ .el-dialog__wrapper {
    margin-top: 60px !important;
}
// .employee-dep-management /deep/ .position-flxed-animation {
//   left: 70%;
//   height: 100%;
//   color: red;
//   margin: 0 !important;
// }
.dialog-top > img {
    vertical-align: middle;
    margin-right: 10px;
    height: 36px;
}
.dialog-btn-group {
    float: right;
}
.dialog-remark {
    font-size: 14px;
    color: #999;
    margin-top: 10px;
}
.dialog-content {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e6e6e6;
}
.dialog-content > div {
    padding: 10px 0;
}
.dialog-content > div > label {
    color: #777;
    width: 30%;
    display: inline-block;
}
/* 新建和编辑 */
.new-dialog-title {
    padding-left: 10px;
    margin-bottom: 3px;
    border-left: 2px solid #46cdcf;
}
.new-dialog-form {
    height: 47vh;
    overflow-y: auto;
    padding: 20px;
}
.new-dialog-form /deep/ .el-form-item {
    width: 50%;
    margin: 0;
    padding-bottom: 10px;
}
.new-dialog-form /deep/ .el-form-item .el-form-item__label {
    padding: 0;
}
.new-dialog-form /deep/ .el-form-item .el-form-item__content {
    width: 70%;
}
.nav-dialog-div {
    margin-bottom: 20px;
}
.nav-dialog-div /deep/ .el-input {
    width: auto;
}
/** 树形结构 */
.el-tree /deep/ .el-tree-node__expand-icon {
    display: none;
}
.el-tree /deep/ .el-tree-node__content {
    height: 30px;

    .node-data {
        .node-img {
            width: 15px;
            height: 15px;
            display: block;
            margin-right: 8px;
            margin-left: 24px;
        }
        .node-label {
            margin-right: 8px;
        }
        .node-label-set {
            display: none;
        }
    }

    .node-data:hover .node-label-set {
        display: block;
    }
}
.el-tree /deep/ .el-tree-node.is-current > .el-tree-node__content {
    background-color: #ebf3ff;
    border-right: 2px solid #46cdcf;
    .node-label-set {
        display: block;
    }
}
.system-view-nav /deep/ .el-tree-node > .el-tree-node__children {
    overflow: visible;
}
.system-view-nav /deep/ .el-tree > .el-tree-node {
    min-width: 100%;
    display: inline-block !important;
}
/* 搜索框图标按钮 */
.icon-search .el-icon-search {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    line-height: 36px;
    text-align: center;
    cursor: pointer;
    font-size: 20px;
    color: #ccc;
}
/* 设置flex布局 */
.flex-index {
    display: flex;
    flex-direction: column;
}
/* 设置占位 */
.flex-box {
    flex: 1;
    border-bottom: 1px solid #e6e6e6;
}
/* 搜索框 */
.icon-search {
    width: 280px;
    position: relative;
}
.new-dialog-form /deep/ .el-select {
    display: block;
}

/** 分页布局 */
.p-contianer {
    position: relative;
    background-color: white;
    height: 44px;
    .p-bar {
        float: right;
        margin: 5px 100px 0 0;
        font-size: 14px !important;
    }
}

/** 勾选操作 */
.selection-bar {
    font-size: 12px;
    height: 54px;
    min-height: 54px;
    padding: 0 20px;
    color: #777;

    .selected—title {
        flex-shrink: 0;
        padding-right: 20px;
        border-right: 1px solid $--table-border-color;
        .selected—count {
            color: $xr-color-primary;
        }
    }
}

.selection-items-box {
    .selection-item {
        width: auto;
        padding: 15px;
        .selection-item-icon {
            display: block;
            margin-right: 5px;
            width: 15px;
            height: 15px;
        }
        .selection-item-name {
            cursor: pointer;
            color: #777;
        }
        .selection-item-name:hover {
            color: $xr-color-primary;
        }
    }
}
.new-dialog-form
    /deep/
    .el-form-item
    .el-form-item__content
    .el-select-group__wrap:not(:last-of-type)::after {
    display: none;
}
.new-dialog-form /deep/ .el-form-item .el-form-item__content .el-select-group {
    padding-left: 10px;
}
.new-dialog-form
    /deep/
    .el-form-item
    .el-form-item__content
    .el-select-group__title {
    border-bottom: 1px solid #e4e7ed;
    padding: 0 0 7px;
    margin: 0 20px 5px;
}

.status-des {
    font-size: 12px;
    color: #777777;
    margin: 0 5px;
    position: absolute;
    left: 0;
    top: 7px;
    .status-des-item {
        margin: 8px;
        display: inline-block;
        div {
            display: inline-block;
            width: 6px;
            height: 6px;
            border-radius: 3px;
            margin-right: 5px;
        }
    }
}

// 提示
// 提示标志
.wukong-help_tips {
    color: #999;
    font-size: 14px;
    margin-left: 3px;
    cursor: pointer;
}

.wukong-help_tips:hover {
    color: $xr-color-primary;
}

// 修改密码和修改登录名的样式
.el-password {
    .el-form-item {
        margin-bottom: 5px;
    }
}

.el-dialog__wrapper /deep/.el-dialog__body {
    padding: 20px;
}

.tips {
    font-size: 13px;
    color: #999;
}
.position-tag{
    margin-left: 82px;
}
.position-tag span{
    margin: 0 5px 5px 0;
}
@import "@/styles/table.scss";
</style>

